<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
        <meta charset="UTF-8">
        <link rel="stylesheet" href="./space.css">
    </head>
    <body>
        <div class="ad-wrap">
            <p style="margin:0 0 10px 0;">
                <a data-traceid="blog_detail_above_text_link_1" data-tracepid="blog_detail_above_text_link" style="color:#A00;font-weight:bold;" href="https://my.oschina.net/u/3779583/blog/2885612" target="_blank">&#x5F00;&#x53D1;&#x5341;&#x5E74;&#xFF0C;&#x5C31;&#x53EA;&#x5269;&#x4E0B;&#x8FD9;&#x5957;&#x67B6;&#x6784;&#x4F53;&#x7CFB;&#x4E86;&#xFF01;
&gt;&gt;&gt; </a>&#xA0;&#xA0;
                <img src="https://www.oschina.net/img/hot3.png" align="absmiddle" style="max-height: 32px; max-width: 32px;">
            </p>
        </div>
        <p>&#x95EE;&#x9898;:&#x4F7F;&#x7528;keep-alive&#x6807;&#x7B7E;&#x540E;&#x90E8;&#x5206;&#x5B89;&#x5353;&#x673A;&#x8FD4;&#x56DE;&#x7F13;&#x5B58;&#x9875;&#x4F4D;&#x7F6E;&#x4E0D;&#x7CBE;&#x786E;&#x95EE;&#x9898;</p>
        <p>&#x89E3;&#x51B3;&#x65B9;&#x6848;:</p>
        <pre>
            <code>&lt;div id=&quot;app&quot;&gt;
  &lt;keep-alive&gt;
   &lt;router-view v-if=&quot;$route.meta.keepAlive&quot;&gt;&lt;/router-view&gt;
  &lt;/keep-alive&gt;
  &lt;router-view v-if=&quot;!$route.meta.keepAlive&quot;&gt;&lt;/router-view&gt;
&lt;/div&gt;
const router = new Router({
 scrollBehavior(to, from, savedPosition) {
  if (savedPosition &amp;&amp; to.meta.keepAlive) {
   return savedPosition;
  }
  return { x: 0, y:0 };
 },
});
</code>
        </pre>
        <blockquote>
            <p>&#x524D;&#x7AEF;&#x5168;&#x6808;&#x5B66;&#x4E60;&#x4EA4;&#x6D41;&#x5708;&#xFF1A;866109386,&#x9762;&#x5411;1-3&#x7ECF;&#x9A8C;&#x5E74;&#x524D;&#x7AEF;&#x5F00;&#x53D1;&#x4EBA;&#x5458;,&#x5E2E;&#x52A9;&#x7A81;&#x7834;&#x6280;&#x672F;&#x74F6;&#x9888;&#xFF0C;&#x63D0;&#x5347;&#x601D;&#x7EF4;&#x80FD;&#x529B;
&#x7FA4;&#x5185;&#x6709;&#x5927;&#x91CF;PDF&#x53EF;&#x4F9B;&#x81EA;&#x53D6;&#xFF0C;&#x66F4;&#x6709;&#x5E72;&#x8D27;&#x5B9E;&#x6218;&#x9879;&#x76EE;&#x89C6;&#x9891;&#x8FDB;&#x7FA4;&#x514D;&#x8D39;&#x9886;&#x53D6;&#x3002;</p>
        </blockquote>
        <ol start="2">
            <li>&#x9875;&#x9762;&#x8FD4;&#x56DE;&#x51FA;&#x73B0;&#x7A7A;&#x767D;&#x5C4F;&#x95EE;&#x9898;</li>
        </ol>
        <p>&#x95EE;&#x9898;</p>
        <p>&#x3010;&#x524D;&#x63D0;&#x3011;&#xFF1A;iOS&#x8BBE;&#x5907;
&#x3010;&#x6B65;&#x9AA4;&#x3011;: &#x9875;&#x9762;A&#x662F;&#x4E2A;&#x5217;&#x8868;&#x5F88;&#x957F;--&gt;&#x6ED1;&#x5230;&#x9875;&#x811A;&#x7684;&#x65F6;&#x5019;&#x70B9;&#x51FB;&#x8DF3;&#x8F6C;&#x4E4B;&#x540E;&#x5230;&#x9875;&#x9762;B---&gt;&#x518D;&#x8FD4;&#x56DE;A&#x9875;&#x9762;
---&gt;&#x5C4F;&#x5E55;&#x4F1A;&#x51FA;&#x73B0;&#x7A7A;&#x767D;&#x906E;&#x7F69;&#x5C42;---&gt;&#x624B;&#x6307;&#x8F7B;&#x89E6;&#x5C4F;&#x5E55;&#x6ED1;&#x52A8;---&gt;&#x906E;&#x7F69;&#x5C42;&#x6D88;&#x5931;

            <img src="https://upload-images.jianshu.io/upload_images/13341631-5b7b6e1981610fb1.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240" alt="">
        </p>
        <p>
            <strong>&#x89E3;&#x51B3;&#x65B9;&#x6848;&#x4E00;</strong>
        </p>
        <p>&#x5728;&#x63A5;&#x53E3;&#x8BF7;&#x6C42;&#x6210;&#x529F;&#x540E;&#x7684;&#x56DE;&#x8C03;&#x64CD;&#x4F5C;&#x5B8C;&#x6210;&#x540E;&#x8FDB;&#x884C;&#x8BE5;&#x64CD;&#x4F5C;,&#x4F8B;&#x5982;</p>
        <pre>
            <code>// fetchCourseList&#x662F;&#x4E00;&#x4E2A;&#x5C01;&#x88C5;&#x597D;&#x7684;Promise&#x8BF7;&#x6C42;
fetchCourseList().then(({ data: courses }) =&gt; {
 this.courses = courses;
}).then(() =&gt; {
  setTimeout(() =&gt; {
    window.scrollTo(0, 1);
    window.scrollTo(0, 0);
  });
});
</code>
        </pre>
        <p>&#x8BE5;&#x65B9;&#x6848;&#x7684;&#x5F0A;&#x7AEF;: &#x6BCF;&#x4E2A;&#x9875;&#x9762;&#x90FD;&#x9700;&#x8981;&#x505A;&#x8FD9;&#x6837;&#x7684;&#x5904;&#x7406;&#xFF0C;&#x4E0D;&#x63A8;&#x8350;&#x4F7F;&#x7528;&#x3002;</p>
        <p>
            <strong>&#x89E3;&#x51B3;&#x65B9;&#x6848;&#x4E8C;(&#x63A8;&#x8350;)</strong>
        </p>
        <p>&#x4F7F;&#x7528;scrollBehavior&#x4E2D;&#x7684;&#x5F02;&#x6B65;&#x6EDA;&#x52A8;&#x64CD;&#x4F5C;</p>
        <pre>
            <code>const router = new Router({
&#xA0;scrollBehavior(to, from, savedPosition) {
&#xA0;&#xA0;// keep-alive &#x8FD4;&#x56DE;&#x7F13;&#x5B58;&#x9875;&#x9762;&#x540E;&#x8BB0;&#x5F55;&#x6D4F;&#x89C8;&#x4F4D;&#x7F6E;
&#xA0;&#xA0;if (savedPosition &amp;&amp; to.meta.keepAlive) {
&#xA0;&#xA0;&#xA0;return savedPosition;
&#xA0;&#xA0;}
&#xA0;&#xA0;// &#x5F02;&#x6B65;&#x6EDA;&#x52A8;&#x64CD;&#x4F5C;
&#xA0;&#xA0;return new Promise((resolve) =&gt; {
&#xA0;&#xA0;&#xA0;setTimeout(() =&gt; {
&#xA0;&#xA0;&#xA0;&#xA0;resolve({ x: 0, y: 1 });
&#xA0;&#xA0;&#xA0;}, 0);
&#xA0;&#xA0;});
&#xA0;},
});
</code>
        </pre>
        <blockquote>
            <p>&#x524D;&#x7AEF;&#x5168;&#x6808;&#x5B66;&#x4E60;&#x4EA4;&#x6D41;&#x5708;&#xFF1A;866109386,&#x9762;&#x5411;1-3&#x7ECF;&#x9A8C;&#x5E74;&#x524D;&#x7AEF;&#x5F00;&#x53D1;&#x4EBA;&#x5458;,&#x5E2E;&#x52A9;&#x7A81;&#x7834;&#x6280;&#x672F;&#x74F6;&#x9888;&#xFF0C;&#x63D0;&#x5347;&#x601D;&#x7EF4;&#x80FD;&#x529B;
&#x7FA4;&#x5185;&#x6709;&#x5927;&#x91CF;PDF&#x53EF;&#x4F9B;&#x81EA;&#x53D6;&#xFF0C;&#x66F4;&#x6709;&#x5E72;&#x8D27;&#x5B9E;&#x6218;&#x9879;&#x76EE;&#x89C6;&#x9891;&#x8FDB;&#x7FA4;&#x514D;&#x8D39;&#x9886;&#x53D6;&#x3002;</p>
        </blockquote>
        <p>&#x8BE5;&#x65B9;&#x6848;&#x76F4;&#x63A5;&#x5728;&#x8DEF;&#x7531;&#x8FDB;&#x884C;&#x5904;&#x7406;&#xFF0C;&#x517C;&#x5BB9;&#x6BCF;&#x4E2A;&#x9875;&#x9762;&#x5E76;&#x4E14;&#x9875;&#x9762;&#x52A0;&#x8F7D;&#x5B8C;&#x540E;&#x5E76;&#x4E5F;&#x4E0D;&#x4F1A;&#x4EA7;&#x751F;1px&#x7684;&#x6EDA;&#x52A8;&#x4F4D;&#x7F6E;&#x3002;</p>
        <div class="ad-wrap" style="margin-top: 12px;">
                                                                </div>
    </body>
</html>
